import request from '../../until/request'
import PubSub from 'pubsub-js'
import Moment from 'moment'
let start
Page({
  // 封装获取歌曲详细信息的函数
  async getSongDetail() {
    const res = await request({
      url: '/song/detail',
      method: 'get',
      data: {
        ids: this.data.songId
      }
    })
    // console.log(res);
    if (res.code === 200) {
      this.setData({
        songName: res.songs[0].name,
        songArtist: res.songs[0].ar[0].name,
        imgUrl: res.songs[0].al.picUrl,
      })
      // 将页面的导航栏标题改为歌曲名
      wx.setNavigationBarTitle({
        title: this.data.songName
      })
    }
  },
  // 封装获取音频的函数
  async getRadio() {
    const res = await request({
      url: '/song/url',
      data: {
        id: this.data.songId
      }
    })
    // console.log(res);
    if (res.code === 200) {
      this.setData({
        radioUrl: res.data[0].url
      })
      this.songPlay()
    }
  },
  // 封装音乐播放上下文函数
  songPlay() {
    this.player = wx.getBackgroundAudioManager()

    if (!this.data.radioUrl) {//vip歌曲获取不到url
      wx.showModal({
        title: '请开通vip',
        content: '此歌曲需要vip',
        success(res) {
          if (res.confirm) {
            // console.log('用户点击确定')
            PubSub.publish('type', 'next')
          } else if (res.cancel) {
            // console.log('用户点击取消')
            wx.navigateTo({
              url: '/pages/recommend/recommend',
            })
            this.player.pause()
          }
        }
      })
      return
    }
    this.player.src = this.data.radioUrl
    this.player.title = this.data.songName

  },
  // 点击页面播放按钮控制播放或暂停
  handlerPlayOrPause() {
    this.setData({
      isPlay: !this.data.isPlay
    })
    // if(this.data.isPlay){//播放
    //   this.player.play()
    // }else{
    //   this.player.pause()
    // }
    this.data.isPlay ? this.player.play() : this.player.pause()
  },
  // 点击播放上一首或者下一首
  handlerSwitch(e) {
    this.player.pause()
    // console.log(e);
    // 获取点击的是上一首还是下一首
    const type = e.target.id
    // 兄弟组件之间传递信息使用pubsub-js
    // 初始化项目 npm init -y
    // 下载pubsub-js  npm i pubsub-js
    // 引入pubsub-js
    PubSub.publish('type', type)

  },
  // 拖动进度条
  // 手指触屏开始
  async handlerStart(e) {
    // console.log(e,'start');
    const windowInfo = await wx.getSystemInfo()
    // console.log(windowInfo);
    start = (windowInfo.windowWidth*2-450)/2
    this.setData({
      isTouch:true,
      width:this.data.progressWidth
    })
    // console.log(start);
    // let width = e.touches[0].pageX*2 - start
    // // console.log(width);
    // let time = (width/450)*this.data.totalTime
    // // console.log(time);
    // this.player.seek(time)

  },
  // 手指拖动
  handlerMove(e) {
    // console.log(e);
    let width = e.touches[0].pageX*2 - start
    if(width>450){
      width = 450
    }
    if(width<0){
      width = 0
    }
    let time = Moment(width/450*this.data.totalTime*1000).format('mm:ss')
    this.setData({
      width:width+'rpx',
      targetTime:time
    })
    // console.log(width);
    // let time = (width/450)*this.data.totalTime

  },
  // 手指松开
  handlerEnd(e) {
    // console.log(e);
    let width = e.changedTouches[0].pageX*2 - start
    // console.log(width);
    let time = (width/450)*this.data.totalTime
    // console.log(time);
    this.setData({
      isTouch:false,
      progressWidth:width+'rpx'
    })
    this.player.seek(time)
  },


  /**
   * 页面的初始数据
   */
  data: {
    isPlay: true,
    songId: '',//歌曲id
    songName: '',//歌曲名称
    songArtist: '',//歌手
    imgUrl: '',//歌曲图片
    radioUrl: '',//音频地址
    currentTime: 0,//音频已播放时长
    durationTime: 0,//音频总时长
    totalTime:0,//未转换的时间
    progressWidth: '',//进度条长度
    isTouch:false,
    width:'',
    targetTime:0
  },

  /**
   * 生命周期函数--监听页面加载
   */
  async onLoad(options) {
    // console.log(options);
    // options里面有url传递过来的id
    this.setData({
      songId: options.songId
    })
    // 获取歌曲详情信息
    await this.getSongDetail()
    // 获取音频地址
    await this.getRadio()
    // 监听音乐播放
    this.player.onPlay(() => {
      this.setData({
        isPlay: true
      })
    })
    // 监听音乐暂停
    this.player.onPause(() => {
      this.setData({
        isPlay: false
      })
    })
    // 监听播放完当前歌曲，自动播放下一首
    this.player.onEnded(() => {
      PubSub.publish('type', 'next')
    })
    // 监听播放时长
    this.player.onTimeUpdate(() => {
      // console.log(this.player.currentTime,this.player.duration,);
      let progressWidth = this.player.currentTime / this.player.duration * 450 + 'rpx'
      this.setData({
        currentTime: Moment(this.player.currentTime * 1000).format('mm:ss'),
        durationTime: Moment(this.player.duration * 1000).format('mm:ss'),
        totalTime:this.player.duration,
        progressWidth
      })


    })

    // 订阅音乐播放id
    PubSub.subscribe('songId', async (_, id) => {
      this.setData({
        songId: id
      })
      // 重新构建音频上下文
      // 获取歌曲详情信息
      await this.getSongDetail()
      // 获取音频地址
      await this.getRadio()
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})